<template>
  <div>
    <x-header :left-options="{showBack: true,preventGoBack:true}" @on-click-back="goBack"
              theme="" @on-click-more="showMenus = true" :right-options="{showMore: ios}" class="">询价清单
    </x-header>
    <div class="fixedSearchBar">
      <search @on-submit="onSubmit" v-model="keywords" :auto-fixed="autoFixed"
              @on-cancel="onCancel"></search>
      <div class="item" style="padding: 10px;background-color: white">
        <a href="javascript:void(0)" class="searchAssistBtn" @click="openSearchAssist"
           style="color:#666;font-size: 14px">
          {{queryDate}}
          <x-icon type="ios-arrow-down" size="14"></x-icon>
        </a>
        <a href="javascript:void(0)" class="searchAssistBtn" @click="openSearchAssist1"
           style="color:#666;margin-left:10px;font-size: 14px">
          {{queryStatus}}
          <x-icon type="ios-arrow-down" size="14"></x-icon>
        </a>
      </div>
    </div>
    <div>
      <scroller height="-137" v-model="status" :lock-x="true" @on-pulldown-loading="onScrollDown"
                :pulldown-config="pullDownConfig" :use-pulldown="true" ref="scrollerEvent">
        <div>
          <SearchLists @error="showError" :dataLists="lists" :showDivider="showDivider"></SearchLists>
          <divider v-if="divider" style="font-size: 12px;color: #b2b2b2;padding: 10px 20px;">别扯了,已经到底了</divider>
        </div>
      </scroller>
    </div>
    <actionsheet v-model="DateQueryShow" :menus="DateMenus" @on-click-menu="DateClick" show-cancel></actionsheet>
    <actionsheet v-model="StatusQueryShow" :menus="StatusMenus" @on-click-menu="StatusClick" show-cancel></actionsheet>
    <popup v-model="showUpdate" position="top" :show-mask="false">
      <div :class="popupWarn?'position-vertical-warn':'position-vertical-demo'">
        {{toastTxt}}
      </div>
    </popup>
    <actionsheet :menus="menus" v-model="showMenus" show-cancel @on-click-menu="refresh"></actionsheet>
  </div>
</template>
<script>
  import {XHeader, Search, GridItem, Divider, Actionsheet, Popup, Scroller, Sticky} from 'Vux';
  import SearchLists from './SearchLists.vue'
  import Util from 'util'
  export default {
    components: {
      XHeader,
      SearchLists,
      Search,
      Actionsheet,
      Divider,
      Popup,
      Scroller,
      Sticky
    },
    data(){
      return {
        showMenus: false,
        ios: true,
        autoFixed: true,
        pullDownConfig: {
          content: 'Pull Down To Refresh',
          height: 90,
          autoRefresh: false,
          downContent: '下拉获取',
          upContent: '下拉更新数据',
          loadingContent: '更新中...',
//          clsPrefix: 'xs-plugin-pulldown-'
        },
        status: {
          pulldownStatus: 'default'
        },
        showDivider: false,
        lists: [],
        dataLists: [],
        queryDate: '近期一周',
        queryStatus: '处理状态',
        DateQueryShow: false,
        StatusQueryShow: false,
        currentDateDuration: 7,
        container: [],
        keywords: '',
        DateMenus: [
          {
            label: "全部询价",
            value: 0
          },
          {
            label: "近期三天",
            value: 3
          },
          {
            label: "近期一周",
            value: 7
          },
          {
            label: "近一个月",
            value: 30
          }
        ],
        StatusMenus: [
          {
            label: "全部",
            value: "3"
          },
          {
            label: "已通过",
            value: "2",
            type: 'primary',
          },
          {
            label: "处理中",
            value: "1"
          },
          {
            label: "未通过",
            value: "0",
            type: 'warn'
          }
        ],
        showUpdate: false,
        toastTxt: "目前数据最新",
        popupWarn: false,
        menus: {
          refresh: '刷新'
        }
      }
    },
    watch: {
      showUpdate (val) {
        if (val) {
          setTimeout(() => {
            this.showUpdate = false
          }, 1500)
        }
      }
    },
    computed: {
      divider(){
        if ((window.innerHeight - 137) - (137.5 * (this.lists.length - 1)) > 0) {
          return false;
        } else {
          return true;
        }
      }
    },
    methods: {
      //刷新
      refresh(val){
        if(val === 'refresh'){
          this.$vux.loading.show({
            text: '刷新中'
          });
          this.getUrl(this.currentDateDuration);
        }else{
          return
        }
      },
      //返回主页
      goBack(){
        this.$router.push({
          path: '/home'
        });
        this.$store.commit('CHANGE_TRANSITION', 'right')
      },
      //唤起toast提示
      showError(info, flag){
        this.showUpdate = true;
        this.toastTxt = info;
        this.popupWarn = flag ? true : false
      },
      onScrollDown(){
        this.$nextTick(() => {
          setTimeout(() => {
            this.$refs.scrollerEvent.donePulldown();
            this.getUrl(this.currentDateDuration);
            this.$refs.scrollerEvent.reset({
              top: 0
            });
          }, 1500);
        })
      },
      fixedData(liss){
        let lis = [];
        if (liss.length > 0) {
          for (let i = 0; i < liss.length; i++) {
            lis.push({
              src: '',
              fallbackSrc: '',
              riskNo: liss[i].riskAssessNo,
              name: liss[i].name,
              title: liss[i].companyName,
              desc: liss[i].state,
              state: liss[i].state,
              date: liss[i].date,
              batch: liss[i].batchNos,
              passFlag: liss[i].flag,
              weChat: 1,
              meta: {
                source: liss[i].flag === "1" ? '来源：微信' : '来源：线下'
              }
            })
          }
          this.showDivider = false;
        } else {
          lis = [];
          this.showDivider = true
        }
        this.lists = lis;
      },
      onSubmit(){
        let reg = new RegExp(this.keywords);
        let ary = [];
        for (let i = 0; i < this.dataLists.length; i++) {
          if (this.dataLists[i].companyName.match(reg) || this.dataLists[i].companyName.match(reg)) {
            ary.push(this.dataLists[i]);
          }
        }
        this.queryStatus = "处理状态";
        this.fixedData(ary);
        this.container = ary;
      },
      onCancel(){
        this.keywords = '';
        this.fixedData(this.dataLists);
        this.container = this.dataLists
      },
      getUrl(flag){
        let time = new Date();
        let obj = {
          head: {
            tranDate: time.toLocaleDateString(),
            tranTime: time.toLocaleTimeString(),
            tranNo: Util.getUUid(),
            funcFlag: "mitMobile"
          },
          body: {
            agentCode: this.$store.state.app.loginInfo ? this.$store.state.app.loginInfo.workNumber : this.$store.state.app.workNumber,
            timeFlag: flag
          }
        };
        $.ajax("../../ui/servlet/GCASServlet/query", {
          method: "post",
          contentType: "text/json;charset=UTF-8",
          data: JSON.stringify(obj),
          success: (info) => {
            this.$vux.loading.hide();
            let data = JSON.parse(info);
            if (data.head.flag === "0") {
              let lists = data.body.ecinquiryResultDetailDTOList === null ? [] : data.body.ecinquiryResultDetailDTOList;
              this.dataLists = lists;
              this.container = lists;
              this.fixedData(lists);
              this.$store.commit("SAVE_ONCE_GET_LISTS", lists);
              this.showError('数据更新完毕');
            } else {
              this.fixedData([]);
              this.showError('无既往询价信息', true);
            }
          },
          error: () => {
            this.$vux.toast.show({
              text: "请求超时",
              type: "warn",
              time: 1000
            });
          }
        })
      },
      openSearchAssist(){
        this.DateQueryShow = true
      },
      openSearchAssist1(){
        this.StatusQueryShow = true
      },
      changeStatus(flag){
        let ary = [];
        for (let i = 0; i < this.container.length; i++) {
          if (this.container[i].flag === flag) {
            ary.push(this.container[i])
          }
        }
        this.fixedData(ary)
      },
      DateClick(key){
        this.$vux.loading.show({
          text: '更新中'
        });
        this.getUrl(key);
        this.currentDateDuration = key;
        this.queryStatus = "处理状态";
        if (key === 0) {
          this.queryDate = "全部询价";
        } else if (key === 3) {
          this.queryDate = "近期三天";
        } else if (key === 7) {
          this.queryDate = "近期一周";
        } else {
          this.queryDate = "近一个月";
        }

      },
      StatusClick(key){
        if (key === '3') {
          this.fixedData(this.container);
          this.queryStatus = "处理状态"
        } else if (key === "2") {
          this.changeStatus("2");
          this.$store.commit('SAVE_CHANGE_STATUS', {status: "2", text: "已通过", dateStatus: this.queryDate});
          this.queryStatus = "已通过"
        } else if (key === "1") {
          this.changeStatus("1");
          this.$store.commit('SAVE_CHANGE_STATUS', {status: "1", text: "处理中", dateStatus: this.queryDate});
          this.queryStatus = "处理中"
        } else if (key === "0") {
          this.changeStatus("0");
          this.$store.commit('SAVE_CHANGE_STATUS', {status: "0", text: "未通过", dateStatus: this.queryDate});
          this.queryStatus = "未通过"
        }
      }
    },
    mounted(){
      let agentCode = this.$store.state.app.loginInfo ? this.$store.state.app.loginInfo.workNumber : this.$store.state.app.workNumber;
      let session = this.$store.state.app.sessionStorageLists;
      let status = this.$store.state.app.changeStatus;
      if (session) {
        this.dataLists = session;
        this.container = session;
        if (status) {
          this.changeStatus(status.status);
          this.queryStatus = status.text;
          this.queryDate = status.dateStatus
        } else {
          this.fixedData(session)
        }
      } else {
        if (agentCode) {
          this.$vux.loading.show({
            text: 'Loading'
          });
          this.getUrl(this.currentDateDuration);
          this.StatusClick(null);
        }
      }
      this.ios = this.$store.state.app.ios;
    }
  }
</script>
